/**
 * 下拉选择组
 */

/*
 *   1 ajax请求数据 初始化数据
 *   2 赋值第一选择项
 *   3 根据第一选择项  查找对应的数据  赋值第二选择项
 *
 *   设置默认值
 *
 *   滚动条
 *   下拉框的宽度
 * */
define(function (require, exports, module) {


    var UI = require("js/UI");


    return function (opts) {
        var opt = $.extend({
            $province: "",
            $city: "",
            $area: ""
        }, opts);

        var $province = opt.$province, $city = opt.$city;
        var $provinceTit=$province.find(".tit"),$cityTit=$city.find(".tit")
        var provinceSelectInst, citySelectInst;

        function dropDownList(data) {

            //初始化第一选择项
            var dataSize = data.length;
            /**
             * 更新选择框中的选择项
              * @param _data
             * @param $wrap
             * @param callback
             */
            var updateOption = function (_data, $wrap, callback) {
                    var currValue = $wrap.find(".tit").text()
                    var dataSize = _data.length, $ul = $("<ul></ul>");
                    for (var i = 0; i < dataSize; i++) {
                        var n = _data[i]["n"];
                        var $li = $("<li></li>").text(n).appendTo($ul);
                        if (n == currValue) {
                            $li.addClass("selected");
                        }
                    }
                    var $viewport = $wrap.find("ul").remove().end().find(".viewport");
                    if ($viewport && !$viewport[0]) {
                        $viewport = $wrap
                    } else {
                        $ul.addClass("overview")
                    }
                    $viewport.append($ul);
                    callback && callback();
                },
                /**
                 * 重置城市选择框选择项
                 * @param value:省会名称 或 直辖市
                 */
                resetCityData = function (value) {
                    //重置数据
                    $cityTit.text("请选择");
                    $city.find("input").val("");
                    for (var i = 0; i < dataSize; i++) {
                        var provinceData = data[i], n = provinceData["n"];
                        if (n == value) {
                            var cityData = provinceData['s'];
                            updateOption(cityData, $city, function () {
                                citySelectInst = new UI.dropDownSelect($city);
                            });
                            return
                        }
                    }
                },
                /**
                 * 初始化城市选择框选择项
                 * @param province
                 * @param city
                 */
                initCityData = function (province, city) {
                    for (var i = 0; i < dataSize; i++) {
                        var provinceData = data[i], n = provinceData["n"];
                        if (n == province) {
                            var cityData = provinceData['s'];
                            for(var j=0;j<cityData.length;j++){
                                if(cityData[j]['n']==city){
                                    updateOption(cityData, $city, function () {
                                        citySelectInst = new UI.dropDownSelect($city);
                                    });
                                    return
                                }
                            }
                            return
                        }
                    }
                }


            //填充第一个选择框的选择项
            updateOption(data, $province, function () {
                provinceSelectInst = new UI.dropDownSelect($province);
                provinceSelectInst.selected(resetCityData)
            });
            initCityData($provinceTit.text(),$cityTit.text());

        }


        $.ajax({
            url: "../json/cityData.json",
            type: "get",
            success: function (json) {
                dropDownList(json)
            }
        })
    }


})